<script setup>
import { htmlToText } from "html-to-text";
// 自定义的属性（编号，标题，简介，置顶，时间）
defineProps({
    id: { required: true, type: Number },
    title: { type: String, default: "暂未设置标题" },
    desc: { type: String, default: "暂未填写内容" },
    top: { required: true, type: Boolean },
    time: { required: true, type: String },
});
</script>

<template>
    <n-thing>
        <template #header>
            <n-ellipsis line-clamp="1">{{ title }}</n-ellipsis>
        </template>
        <template #description>
            <n-ellipsis
                line-clamp="2"
                :tooltip="false"
            >
                <n-text depth="3">{{ htmlToText(desc) }}</n-text>
            </n-ellipsis>
        </template>
        <template #default>
            <n-space align="center">
                <n-tag
                    v-if="top"
                    type="success"
                    :bordered="false"
                    size="small"
                >
                    置顶
                </n-tag>
                <n-divider
                    v-if="top"
                    vertical
                />
                <n-text depth="3">{{ time }}</n-text>
            </n-space>
        </template>
    </n-thing>
</template>